﻿@page
@model FytSoa.Web.Pages.FytAdmin.Cms.VideoModifyModel
@{ ViewData["Title"] = "视频管理";
                Layout = "~/Pages/FytAdmin/_Layout.cshtml"; }
<div id="container">
    <form class="layui-form form-cus form-back" action="">
        <div class="panel-body">
            <div class="panel-addpic">
                <div class="text">基本属性</div>
                <div class="form-cur-wall">
                    <label style="line-height:inherit;">属性：</label>
                    <div class="layui-input-block">
                        <input type="checkbox" name="IsTop" @(Model.Video.IsTop ? "checked=''" : "") lay-skin="primary" title="是否推荐">
                    </div>
                </div>
                <div class="text else">视频封面</div>
                <ul class="addpic-list clearfix">
                    <li>
                        <div class="add-photo default">
                            <input class="imgv" id="videoCover" name="videoCover" type="hidden" value="@Model.Video.VideoCover">
                            <div class="select-newimg fyt-cloud @(!string.IsNullOrEmpty(Model.Video.VideoCover)?"layui-hide":"")" data-text="videoCover" data-img="imgShow" data-type="form">
                                <i class="icon-addphote"></i>
                                <span>文件图片</span>
                            </div>
                            <div class="add-photo-wall @(!string.IsNullOrEmpty(Model.Video.VideoCover)?"":"layui-hide")">
                                <img id="imgShow" src="@Model.Video.VideoCover">
                                <div class="phote-edit">
                                    <a class="photo-tool fyt-cloud" data-text="videoCover" data-img="imgShow" data-type="form" href="javascript:void(0)"><i class="layui-icon layui-icon-edit"></i>更换</a>
                                    <a class="photo-tool last" href="javascript:void(0)" onclick="oc.deleteFile()"><i class="layui-icon layui-icon-delete"></i>删除</a>
                                </div>
                                <div class="cover">封面</div>
                            </div>
                        </div>
                    </li>
                </ul>

                <div style="height:50px;"></div>
            </div>
            <div class="layui-row">
                <div class="layui-form-item">
                    <label class="layui-form-label">标题</label>
                    <div class="layui-input-block">
                        <input type="text" name="Title" value="@Model.Video.Title" maxlength="100" lay-verify="required" lay-verType="tips" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">副标题</label>
                    <div class="layui-input-block">
                        <input type="text" name="SubTitle" value="@Model.Video.SubTitle" maxlength="500" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">视频文件</label>
                    <div class="layui-input-block fyt-upfile">
                        <input type="text" name="VideoUrl" id="VideoUrl" value="@Model.Video.VideoUrl" maxlength="500" autocomplete="off" class="layui-input" lay-verify="required" lay-verType="tips">
                        <button type="button" class="layui-btn fyt-cloud" data-text="VideoUrl" data-type="iframe">选择文件</button>
                    </div>
                </div>
            </div>

            <div class="layui-row">
                <div class="layui-form-item layui-form-text">
                    <label class="layui-form-label">内容</label>
                    <div class="layui-input-block">
                        <textarea id="Context" name="Context" placeholder="请输入内容" class="layui-textarea">@Html.Raw(Model.Video.Context)</textarea>
                    </div>
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <button class="layui-btn" lay-submit="" lay-filter="submit" id="submit"><i class="layui-icon layui-icon-loading layui-icon layui-anim layui-anim-rotate layui-anim-loop layui-hide"></i>立即提交</button>
                    <button type="button" class="layui-btn layui-btn-primary btn-open-close">返回列表</button>
                </div>
            </div>
        </div>
        <input type="hidden" name="Id" id="Id" value="@Model.Video.Id" />
        <input type="hidden" name="ParentId" value="@Model.Video.ParentId" />
    </form>
    <script src="/themes/tinymce/tinymce.min.js"></script>
    <script src="/themes/tinymce/langs/zh_CN.js"></script>
    <script>
        var oc;
        tinymce.init({
            convert_urls: false,
            selector: '#Context',
            height: 300,
            plugins: 'print preview code searchreplace autolink directionality visualblocks visualchars fullscreen image link media codesample table charmap hr pagebreak nonbreaking anchor toc insertdatetime advlist lists textcolor wordcount imagetools contextmenu colorpicker textpattern help filemanager',
            toolbar: 'formatselect styleselect | bold italic forecolor backcolor | link filemanager | alignleft aligncenter alignright alignjustify  | numlist bullist outdent indent  | removeformat'
        });
        layui.config({
            base: '/themes/js/modules/'
        }).use(['layer', 'jquery', 'common', 'form', 'laydate', 'slider'], function () {
            var form = layui.form, $ = layui.jquery, os = layui.common;
            form.render();
            $('.panel-addpic').css({ 'min-height': $(window).height() - 95 });
            os.cloudFile();
            oc = {
                setContent(v) {
                    for (var i = 0; i < v.length; i++) {
                        var item = v[i];
                        var imgIndex = v.lastIndexOf('/');
                        var str = item.name.substring(imgIndex + 1, item.name.length);
                        if (os.isExtImage(item.name)) {
                            tinyMCE.editors[0].execCommand('mceInsertContent', false, '<p><img src="' + item.name + '" alt="' + str + '"/></p>')
                        } else {
                            tinyMCE.editors[0].execCommand('mceInsertContent', false, '<p style="padding:12px 20px;background-color: #edf3f5;"><a href="' + item.name + '" target="_blank" title="' + str + '">' + str + '</a></p>')
                        }
                    }
                },
                fileSave(v) {
                    $(".select-newimg").addClass('layui-hide');
                    $(".add-photo-wall").removeClass('layui-hide');
                    $('#videoCover').val(v);
                    $('#imgShow').attr('src', v);
                },
                deleteFile() {
                    $(".select-newimg").removeClass('layui-hide');
                    $(".add-photo-wall").addClass('layui-hide');
                    $('#videoCover').val('');
                    $('#imgShow').attr('src', '');
                }
            };

            //监听提交
            form.on('submit(submit)', function (data) {
                $('#submit').attr('disabled', true).find('i').removeClass('layui-hide');
                var urls = "api/video/add";
                if ($("#Id").val() !== '0') {
                    urls = "api/video/edit";
                }
                data.field.IsTop = data.field.IsTop === 'on' ? true : false;
                data.field.Context = tinyMCE.editors[0].getContent();
                //os.log(data.field);
                os.ajax(urls, data.field, function (res) {
                    $('#submit').attr('disabled', false).find('i').addClass('layui-hide');
                    if (res.statusCode === 200) {
                        var $$ = parent.layui.jquery;
                        $$("#isSave").val('1');
                        parent.active.closeCloumnModify();
                    }
                    else {
                        os.error(res.message);
                    }
                });
                return false;
            });
            $(".btn-open-close").on('click', function () {
                parent.active.closeCloumnModify();
            });
        });
    </script>
</div>
